page {
	background-color: #f0f2f6;
	height: 100%;
}

.root_view {
	width: 100%;
	height: 100%;
}

/* 目前：像素单位是按照iphone6上1px=2rpx的公式适配转换的 */

/*************** 整个聊天区的整体样式 *****************/
.chatbox {
	width: 100%;
	height: 100%;
	flex-direction: column;
	justify-content: center;
	line-height: 1.4;
}

/*************** 顶部header区的样式 *****************/
.chatbox_header {
	flex: 0 0 auto;
	background: #3d3d3d;
	height: 116rpx;
	width: 100%;
	font-size: 24rpx;
	box-shadow: 0 4rpx 6rpx 0 rgb(4 5 13 / 23%);
	/*position: fixed;top: 0px;z-index: 999;*/
}

.chatbox_headerwrapper {
	line-height: 116rpx;
	color: #fff;
}

.chatbox_header_pname {
	text-align: left;
	margin-left: 20rpx;
	font-size: 36rpx;
}

.chatbox_header_pversion {
	margin-left: 8rpx;
	color: #ccc;
}

#chatbox_header_userinfo {
	float: right;
	margin-right: 20rpx;
	text-shadow: 0 2rpx 0 rgb(0 0 0 / 30%);
}

.showusername {
	font-weight: bold;
}

#netstatusicon:before {
	content: "";
	height: 22rpx;
	width: 22rpx;
	display: inline-block;
	border-radius: 100%;
	margin-right: 8rpx;
	vertical-align: middle;
}

#netstatusicon.light:before {
	background-color: #FFFF00
		/*#b0ff34*/
		!important;
	/*border: 1px solid #d1d505 !important;*/
	box-shadow: 0px 0px 20rpx 20rpx rgb(255 255 255 / 35%);
}

.net_ok #netstatusicon:before {
	background-color: #91e43c;
	/* border: 1px solid #75c920; */
}

.net_warn #netstatusicon:before {
	background-color: #ff8c6f;
	/*border: 1px solid #f26c4f;*/
}

/*************** 中间消息区的样式 *****************/
/*#chatbox_content {height: 100%;line-height: 1.4;margin-top: 136rpx;}*/
.chatbox_messages {
	flex: 1 0 auto;
	border-bottom: 0;
	/* background-color: #efeff4; */
	/* min-height: 600rpx; */
	/*padding-bottom: 120rpx;*/
	width: 100%;
	/*display: flex;flex-direction: column;*/
}

.chatbox_messages:after {
	display: block;
	clear: both;
	height: 0;
	content: "\0020";
}

.system {
	text-align: center;
	color: #999;
	font-size: 26rpx;
	padding: 2rpx;
	margin: 20rpx 20rpx 20rpx 20rpx;
	clear: both;
}

.msg-system {
	/* color: #999; */
	font-size: 24rpx;
	color: #979ca6;
	background: #e5e7ec;
	display: inline-block;
	padding: 10rpx 30rpx 10rpx 30rpx;
	border-radius: 24rpx;
	word-break: break-all;
}

.msg-system .msg-system-time {
	color: #ccc;
	margin-left: 10px;
	display: inline-block;
}

.user {
	float: right;
	text-align: right;
}

.user {
	padding: 20rpx;
	clear: both;
}

.user>text {
	max-width: 500rpx;
	position: relative;
	display: inline-block;
	padding: 10rpx;
	margin: 0 10rpx 0 14rpx;
	text-align: left;
	border-radius: 20rpx;
	color: #000;
	box-shadow: inset 0 0 2rpx #a9e99a;
	background-color: #a9e99a;
	vertical-align: top;
	word-break: break-all;
	font-size: 28rpx;
}

/*margin: 0 10px 0 24rpx;*/
.user>text:before {
	content: "";
	position: absolute;
	right: -10rpx;
	top: 8rpx;
	width: 0;
	height: 0;
	border-top: solid transparent;
	border-left: 14rpx solid #a9e99a;
	border-bottom: 8rpx solid transparent;
}

.user>.user_name {
	font-weight: normal;
	font-size: 28rpx;
	color: #f60;
	max-width: 120rpx;
	height: 72rpx;
	overflow: hidden;
	float: right;
}

.service {
	padding: 20rpx;
	clear: both;
}

.service {
	float: left;
}

.service>.service_name {
	max-width: 120rpx;
	height: 72rpx;
	font-weight: normal;
	font-size: 28rpx;
	color: #999;
	overflow: hidden;
	float: left;
}

.service>text {
	max-width: 500rpx;
	display: inline-block;
	position: relative;
	padding: 24rpx;
	margin: 0 40rpx 0 20rpx;
	border-radius: 20rpx;
	background-color: #fff;
	box-shadow: inset 0 0 1px #fff;
	vertical-align: top;
	font-size: 28rpx;
}

.service>text:before {
	content: "";
	position: absolute;
	left: -10rpx;
	top: 8rpx;
	width: 0;
	height: 0;
	border-top: solid transparent;
	border-right: 14rpx solid #fff;
	border-bottom: 8rpx solid transparent;
}

/*************** 底部输入区的样式 *****************/
/* 最后两项safe-area-inset-bottom的计算属性用于适配iOS的全面屏safearea区 */
.chatbox_inputs {
	flex: 0 0 auto;
	display: flex;
	justify-content: center;
	width: 100%;
	/* box-shadow: 0 0 1px #000; */
	background-color: #fff;
	height: 200rpx;
	border-top: 1px #e8e8e8 solid;
	box-shadow: 0px -40rpx 42rpx -44rpx rgb(0 0 0 / 10%);
	height: auto;
	padding-top: 20rpx;
	padding-bottom: 20rpx;
	padding-bottom: max(20rpx, constant(safe-area-inset-bottom));
	padding-bottom: max(20rpx, env(safe-area-inset-bottom));
}

/* 在父flex布局中自动占满余下 */
.chatbox_inputs .input-content {
	flex: 1 0 auto;
	display: flex;
	justify-content: center;
	/*box-flex: 1;*/
	background-color: #fff;
	/* height: 28px; */
	line-height: 50rpx;
}

.input-content input {
	margin: 0;
	/*float: left;*/
	padding: 0 16rpx;
	height: 68rpx;
	font-size: 28rpx;
	background-color: #f7f9fc;
	border: none;
	border-radius: 12rpx;
	color: #000;
	/* box-shadow: 0 0 1px #000; */
	border: 2rpx solid #e9e9e9;
	box-shadow: 0px 0px 20rpx 0rpx rgb(0 0 0 / 10%);
}

/* 在父flex布局中固定大小不拉伸 */
.input-content .receiver {
	flex: 0 0 auto;
	width: 88rpx;
	margin-left: 20rpx;
	margin-right: 20rpx;
}

/* 在父flex布局中占满余下 */
.input-content .content {
	flex: 1 0 auto;
	margin-right: 20rpx;
}

/* 在父flex布局中固定大小不拉伸 */
.chatbox_inputs .input-button {
	flex: 0 0 auto;
	width: 88rpx;
	padding: 0rpx;
	line-height: 68rpx;
	height: 68rpx;
	font-size: 28rpx;
	margin-right: 20rpx;
	border: none;
	border-radius: 12rpx;
	color: #fff;
	text-align: center;
	background: #42b983;
	box-shadow: 0rpx 10rpx 40rpx 0rpx rgb(0 0 0 / 10%);
}

.input-button:active,
.input-button[disabled] {
	color: #fff;
	background-color: #1F771C;
}

/*************** 对weui的一些样式进行覆盖 *****************/
.login-form .weui-form__title {
	color: #0e1a26;
}

.login-form .weui-form__desc {
	color: #0e1a26;
}

.login-form .weui-badge {
	background: linear-gradient(150deg, #282c34, #282c34);
	vertical-align: text-top;
	color: #fff37e;
}

/* background-color:#e8ac4f; */
.login-form .weui-cell__hd .weui-label {
	color: #0e1a26;
}

.login-form .weui-form__opr-area .weui-btn {
	background-color: #42b983;
	padding-top: 12rpx;
	padding-bottom: 12rpx;
	font-weight: normal;
}

.login-form .weui-form__tips {
	color: #e8ac4f;
}

.login-form .weui-footer__text {
	font-size: 28rpx;
	color: #a0a0a0;
}

.login-form .weui-footer__link {
	margin: 0 6rpx;
	text-decoration: none;
}

.chatbox .weui-icon-warn {
	color: rgb(255, 69, 58);
	width: 14rpx;
	height: 14rpx;
	padding: 12rpx;
}

.chatbox .weui-icon-success {
	color: #42b983;
	width: 14rpx;
	height: 14rpx;
	padding: 12rpx;
}